<template>
  <div>
    <div class="work-experience primary-text" v-if="form.sta != 5 || form.editSta != data.id">
      <el-row>
        <el-col :span="20" class="work-experience-head">
          <!--大学名称大学名称大学名称-->
          {{data.school}}
          <span class="work-experience-time">{{data.startTime}} / {{data.endTime}}</span>
        </el-col>
        <el-col :span="2" class="orange-text">
          <div @click="editContent(data.id)">
            <img src="../../../assets/img/resume/bianji.png" width="14px" height="14px">
            编辑
          </div>
        </el-col>
        <el-col :span="2" class="orange-text">
          <div @click="doDelete(data.id)">
            <img src="../../../assets/img/resume/detele.png" width="14px" height="14px">
            删除
          </div>
        </el-col>
      </el-row>
      <el-row style="padding:16px 0 19px 0">
        <span>
          <!--专业名称-->
          {{data.major ? data.major : '---'}}
        </span>
        <span class="line-padding">|</span>
        <span>
          <!--本科-->
          {{data.academicType ? data.academicType : '---'}}
        </span>
      </el-row>
    </div>

    <div class="edit-content" v-if="form.sta == 5 && form.editSta == data.id">
      <div class="all-job-resume">
        <el-form label-width="100px" label-position="right">
          <el-row>
            <el-col :span="12">
              <el-form-item label="学校名称">
                <el-input class="theme-input all-input" v-model="data.school"></el-input>
              </el-form-item>
              <el-form-item label="学历">
                <el-select class="all-input" v-model="data.academicTypeId">
                  <el-option
                    v-for="(item,index) in educationType"
                    :key="index"
                    :value="item.id"
                    :label="item.content"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="11" :offset="1">
              <el-form-item label="所学专业">
                <el-input class="theme-input all-input" v-model="data.major"></el-input>
              </el-form-item>
              <el-form-item label="在读时间">
                <el-date-picker
                  :editable="false"
                  class="resume-datepicker"
                  value-format="yyyy-MM"
                  type="monthrange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  v-model="time"
                ></el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item class="form-button-right">
            <el-button class="ghost-button" @click="cancel">取消</el-button>
            <el-button class="submit-button" @click="onSubmit">确认</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['data', 'educationType', 'form'],
  data() {
    return {
      time: [],
      pickerOptions: {
        shortcuts: [
          {
            text: '今年至今',
            onClick(picker) {
              const end = new Date()
              const start = new Date(new Date().getFullYear(), 0)
              picker.$emit('pick', [start, end])
            }
          }
        ]
      }
    }
  },
  methods: {
    check() {
      if (
        this.data.school == '' ||
        this.data.academicId == '' ||
        this.data.major == '' ||
        this.time == ''
      ) {
        _g.message('数据不能为空', 'warning')
        return false
      }
      return true
    },

    doDelete(id) {
      _g.apiPost('/talent/deleteEducationExp.do', { educationExpId: id }).then(
        res => {
          _g.toMessage(res)
          this.$emit('on-pitch', true)
        }
      )
    },
    editContent(id) {
      this.form.sta = 5
      this.form.editSta = id
    },
    cancel() {
      this.$emit('on-pitch', true)
      this.form.sta = -1
      this.form.editSta = -1
    },
    onSubmit() {
      if (!this.check()) return false
      let params = {
        id: this.data.id,
        school: this.data.school,
        academicId: this.data.academicTypeId,
        major: this.data.major,
        startTime: this.time[0],
        endTime: this.time[1]
      }
      _g.apiPost('/talent/updateEducationExp.do', params).then(res => {
        _g.toMessage(res)
        this.cancel()
      })
    },
    setTimeData() {
      this.time.push(this.data.startTime)
      this.time.push(this.data.endTime)
    }
  },
  mounted() {
    this.setTimeData()
  },
  components: {}
}
</script>

<style lang="scss" scoped>
</style>
